<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<%@page import="csc.traning.wpsj.dao.User"%>
 <%@ taglib tagdir="/WEB-INF/tags" prefix="mytags" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>User Profile Editor</title>
<!-- <script type="text/javascript" src="scripts/jquery-1.6.2.js"></script>
<script type="text/javascript" src="scripts/jquery.validate.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$('#userForm').validate({
			rules : {
				firstName : {
					required : true
				},
				lastName : {
					required : true
				},
				email : {
					required : true,
					email : true
				},
				cNewPass : {
					equalTo : newPass
					
				},
				crrPass : {
					required : true
				},
				phone : {
					required : true
				}
			},
			messages : {
				firstName : {
					required : 'First name must be not empty.'
				},
				lastName : {
					required : 'Last name must be not empty.',
				},
				email : {
					required : 'Email must not be empty.',
					email : 'Email is not valid.'
				},
				cNewPass : {
					equalTo : 'New password and confirm new password are not matched.'
				},
				phone : {
					required : 'Phone number must be not empty.'
				},
				crrPass : {
					required : 'Current password must be not empty.'
				}
			}
		});
		$("#cancel").click(function(){
	         window.location = "pages/file_management.jsp";    
		});
	});
</script> -->
<%
	User user = (User)session.getAttribute("user");
%>
</head>
<body>
	<div style="width: 1000px; height: 50px; text-align: right;">
		Welcome <b>hdang</b>, <a href="#">Logout</a>
	</div>
	<div style="width: 1000px">
		<!-- <div style="float: left; width: 200px; text-align: left;">
			<div>
				<fieldset style="height: 200px; background: #EFEDFC">
					<legend style="color: graytext; font-weight: bold;">Common
						Information</legend>
					<p style="font-size: 14">Capacity: 20% in use</p>
					<p style="font-size: 14">Currently Online: 10</p>

				</fieldset>
			</div>
			<div>
				<fieldset style="height: 200px; background: #EFEDFC">
					<legend style="color: graytext; font-weight: bold;">User
						Profiles</legend>
					<p style="font-size: 14">Huynh Dang</p>
					<p style="font-size: 14">0903888777</p>
					<p style="font-size: 14">hdang@test.com</p>
					<br />
					<p style="font-size: 14; text-align: right">
						<a href="#">Edit Profiles</a>
					</p>
				</fieldset>
			</div>
		</div> -->
		<mytags:info/>

		<div style="float: left; width: 800px;">
			<fieldset style="min-height: 500px;">
				<legend style="color: graytext; font-weight: bold;">User
					Profiles Editor</legend>
				<br />
				<div align="center">
					<form id="userForm" action="editUser" method="post">
						<table>
							<tr>
								<td>First Name:</td>
								<td><input type="text" id="firstName" value="<%=user.getFirstName() %>" name="firstName" size="20px" /><span
									style="color: red;">* ${errF}</span></td>
							</tr>
							<tr>
								<td>Last Name:</td>
								<td><input type="text" id="lastName" value="<%=user.getLastName() %>" name="lastName" size="20px" /><span
									style="color: red;">* ${errL}</span></td>
							</tr>
							<tr>
								<td>Username:</td>
								<td><input type="text" readonly="readonly" value="<%=user.getUserName() %>" id="username" name="username" size="20px" /><span
									style="color: red;"></span></td>
							</tr>
							<tr>
								<td>Email Address:</td>
								<td><input type="text" id="email" name="email" size="40px" value="<%=user.getEmailAddress() %>" /><span
									style="color: red;">*  ${errE}</span></td>
							</tr>
							<tr>
								<td>Password:</td>
								<td><input type="password" id="crrPass" name="crrPass" size="30px" /><span
									style="color: red;">* ${errP}</span></td>
							</tr>
							<tr>
								<td>New Password:</td>
								<td><input type="password" id="newPass" name="newPass" size="30px" /></td>
							</tr>
							<tr>
								<td>Confirm New Password:</td>
								<td><input type="password" id="cNewPass" name="cNewPass" size="30px" /><span
									style="color: red;"> ${errN}</span></td>
							</tr>

							<tr>
								<td>Cellphone:</td>
								<td><input type="text" id="phone" name="phone" size="30px" value="<%=user.getCellphone()%>"/><span
									style="color: red;"> ${errPN}</span></td>
							</tr>
							<tr align="center">
								<td colspan="2"><br /> <br /> <input type="submit"
									value="Accept Changes" /><input type="button" value="Cancel" id="cancel"/><br /></td>
							</tr>
						</table>
						<% if(request.getAttribute("err") != null){ %>
						<div> <span style="color: red"><%=request.getAttribute("err") %></span></div>
						<%}%>
					</form>
				</div>
			</fieldset>
		</div>

	</div>
</body>
</html>